{include file="public/header" /}

<body>
    <div class="layui-fluid">
        <div class="layui-row">
            <form action="" method="post" class="layui-form layui-form-pane">
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">商家名称</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="title" name="title" required="" lay-verify="required"
                                autocomplete="off" class="layui-input" value="{$row.title|default=''}" placeholder="">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">商家备注信息</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="remark" name="remark" required="" lay-verify="required"
                                autocomplete="off" class="layui-input" value="{$row.remark|default=''}" placeholder="">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">商家账号</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="account" name="account" required="" lay-verify="required"
                                autocomplete="off" class="layui-input" value="{$row.account|default=''}" placeholder="">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">联系电话</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="mobile" name="mobile" required="" lay-verify="required"
                                autocomplete="off" class="layui-input" value="{$row.mobile|default=''}" placeholder="">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">服务描述</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <textarea name="descs" placeholder="请输入内容"
                                class="layui-textarea">{$row.descs|default=''}</textarea>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">状态</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <select name="status" lay-verify="required" lay-filter="type">
                                <option value="1" {if !empty($row.status) && $row.status==1}selected{/if}>营业</option>
                                <option value="2" {if !empty($row.status) && $row.status==2}selected{/if}>下线</option>
                                <option value="3" {if !empty($row.status) && $row.status==3}selected{/if}>下架</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">是否仅展示</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <select name="shows" lay-verify="required" lay-filter="type">
                                <option value="1" {if !empty($row.shows) && $row.shows==1}selected{/if}>展示可下单</option>
                                <option value="2" {if !empty($row.shows) && $row.shows==2}selected{/if}>仅展示不可下单</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">商家密码</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="password" name="password" autocomplete='new-password' class="layui-input"
                                placeholder="请填写密码">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">营业时间</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="text" id="test" name="fwtime" autocomplete="off" class="layui-input"
                                placeholder="" value="{$row.fwtime|default=''}">
                        </div>
                    </div>
                </div>
                {if empty($row['id'])}
                <div class="layui-card layui-form" lay-filter="component-form-element">
                    <div class="layui-card-header">服务区域类型</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <input type="radio" name="type" lay-filter="type" value="3" {if !empty($row.type) &&
                                $row.type==3}checked{/if} title="区域服务">
                            <input type="radio" name="type" lay-filter="type" value="4" {if !empty($row.type) &&
                                $row.type==4}checked{/if} title="街道服务">
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element" id="provinceshow" {if
                    !empty($row.type) && $row.type> 1} style="display:block"{else}style="display:none"{/if}>
                    <div class="layui-card-header">选择省份</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <select name="province" data-area="" lay-filter="province">
                                <option value="">请选择选择省份</option>
                                {foreach $province as $v}
                                <option value="{$v.area_code}" {if !empty($row.province) &&
                                    $row.province==$v.area_code}selected{/if}>{$v.name}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element" id="cityshow" {if
                    !empty($row.type) && $row.type> 1} style="display:block"{else}style="display:none"{/if}>
                    <div class="layui-card-header">选择城市</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <select name="city" data-area="" lay-filter="city">
                                <option value="">请选择选择城市</option>
                                {foreach $city as $v}
                                <option value="{$v.area_code}" {if !empty($row.city) &&
                                    $row.city==$v.area_code}selected{/if}>{$v.name}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element" id="areashow" {if
                    !empty($row.type) && $row.type> 2} style="display:block"{else}style="display:none"{/if}>
                    <div class="layui-card-header">选择区域</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <select name="area" data-area="" lay-filter="area">
                                <option value="">请选择选择城市</option>
                                {foreach $area as $v}
                                <option value="{$v.area_code}" {if !empty($row.area) &&
                                    $row.area==$v.area_code}selected{/if}>{$v.name}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>
                <div class="layui-card layui-form" lay-filter="component-form-element" id="streetshow" {if
                    !empty($row.type) && $row.type> 3} style="display:block"{else}style="display:none"{/if}>
                    <div class="layui-card-header">选择街道</div>
                    <div class="layui-card-body layui-row layui-col-space10">
                        <div class="layui-col-md12">
                            <select name="street" data-area="" lay-filter="street">
                                <option value="">请选择选择街道</option>
                                {foreach $street as $v}
                                <option value="{$v.id}" {if !empty($row.street) && $row.street==$v.id}selected{/if}>
                                    {$v.name}</option>
                                {/foreach}
                            </select>
                        </div>
                    </div>
                </div>
                {/if}
                <div class="layui-form-item">
                    <input type="hidden" value="{$row.id|default=''}" name="id">
                    <button class="layui-btn" lay-submit="" lay-filter="add">提交</button>
                </div>
            </form>
        </div>
    </div>

    {include file="public/footer" /}
    <script src="/static/leyedit/Layui-KnifeZ/layui.all.js"></script>
    <script src="/static/leyedit/ace/ace.js"></script>
    <script>
        layui.use(['layer', 'jquery', 'form', 'laydate'], function () {
            $ = layui.jquery;
            var form = layui.form
                , laydate = layui.laydate
                , layer = layui.layer;
            laydate.render({
                elem: '#test'
                , type: 'time'
                , format: 'HH:mm'
                , range: true
            });
            form.on('radio(type)', function (data) {
                var type = data.value;
                if (type == 1) {
                    $('#provinceshow').hide();
                    $('#cityshow').hide();
                    $('#areashow').hide();
                    $('#streetshow').hide();
                }
                if (type == 2) {
                    $('#provinceshow').show();
                    $('#cityshow').show();
                    $('#areashow').hide();
                    $('#streetshow').hide();
                }
                if (type == 3) {
                    $('#provinceshow').show();
                    $('#cityshow').show();
                    $('#areashow').show();
                    $('#streetshow').hide();
                }
                if (type == 4) {
                    $('#provinceshow').show();
                    $('#cityshow').show();
                    $('#areashow').show();
                    $('#streetshow').show();
                }
            });
            //监听省份选择
            form.on('select(province)', function (data) {
                if (!data.value) {
                    return false;
                }
                //发异步，把数据提交给php
                $.ajax({
                    type: 'get',
                    url: '/base/getregion',
                    data: { area_code: data.value, level: 2 },
                    success: function (res) {
                        if (res.status == 0) {
                            var str = '<option value="0">请选择城市</option>';
                            $.each(res.data, function (i, obj) {
                                str += '<option value="' + obj.area_code;
                                str += '">' + obj.name;
                                str += '</option>';
                            });
                            $('select[name="city"]').html(str);
                            $('select[name="area"]').html('');
                            $('select[name="street"]').html('');
                            form.render();
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                });
                return false;
            });
            //监听城市选择
            form.on('select(city)', function (data) {
                if (!data.value) {
                    return false;
                }
                //选中状态发异步，把数据提交给php
                $.ajax({
                    type: 'get',
                    url: '/base/getregion',
                    data: { area_code: data.value, level: 3 },
                    success: function (res) {
                        if (res.status == 0) {
                            var str = '<option value="0">请选择区域</option>';
                            $.each(res.data, function (i, obj) {
                                str += '<option value="' + obj.area_code;
                                str += '">' + obj.name;
                                str += '</option>';
                            });
                            $('select[name="area"]').html(str);
                            $('select[name="street"]').html('');
                            form.render();
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                });

                return false;
            });
            //监听区域选择
            form.on('select(area)', function (data) {
                if (!data.value) {
                    return false;
                }
                //选中状态发异步，把数据提交给php
                $.ajax({
                    type: 'get',
                    url: '/base/getregion',
                    data: { area_code: data.value, level: 4, isget: 1 },
                    success: function (res) {
                        if (res.status == 0) {
                            var str = '<option value="0">请选择街道</option>';
                            $.each(res.data, function (i, obj) {
                                str += '<option value="' + obj.id;
                                str += '">' + obj.name;
                                str += '</option>';
                            });
                            $('select[name="street"]').html(str);
                            form.render();
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                });

                return false;
            });
            //监听提交
            form.on('submit(add)', function (data) {
                $.ajax({
                    'type': 'post',
                    data: data.field,
                    success: function (res) {
                        if (res.code == 0) {
                            layer.msg(res.msg, { icon: 6, time: 1000 }, function () {
                                // 获得frame索引
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.location.reload();
                                parent.layer.close(index);
                            });
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                });
                return false;
            });
        });
    </script>

</body>

</html>